<template>
  <div id="app" class="skSendUser">
    <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
      <a-form-model-item label="接收用户" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">
        <a-radio-group v-model="model.msgType"  @change="chooseMsgType">
          <a-radio value="1">全体用户</a-radio>
          <a-radio value="2">指定用户</a-radio>
          <a-radio value="3">教职工</a-radio>
          <a-radio value="4">家长</a-radio>
        </a-radio-group>
      </a-form-model-item>
      <a-form-model-item label="选择用户" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name" v-if="model.msgType == '2'">
        <a-tree
          v-model="model.checkedKeys"
          checkable
          :auto-expand-parent="autoExpandParent"
          :tree-data="treeData"
          :selected-keys="selectedKeys"
          @check="onCheck"
        />
      </a-form-model-item>
    </a-form-model>
  </div>
</template>
<script>
import { httpAction, getAction } from '@/api/manage'
export default {
  name: 'skSendUser',
  data() {
    return {
      model:{
        msgType:"",
        checkedKeys:[]
      },
      validatorRules:{},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      autoExpandParent: true,   //是否自动展开父节点
      treeData:[],
      selectedKeys:[]
    }
  },
  props:{
    value:Object
  },
  watch:{
    value:{
      handler(val){
        if (val) {
          this.model.msgType = val.msgType;
          this.model.checkedKeys = val.checkedKeys
        }
      },
      immediate:true
    }
  },
  components: {},
  
  filters: {},

  computed: {},
  
  created() {
    this.chooseMsgType()
  },

  activated() {},

  mounted() {},

  methods: {
    chooseMsgType(){
      if (this.model.msgType == "2") {
        const url = "/sys/user/getTenantUsers"
        this.treeData = []
        getAction(url).then((res)=>{
          if(res.success){
            this.handeTreeData(res.result)
          } else {
            this.$message.warning(res.message);
          }
        }).catch((error)=>{
          console.error(error);
        })
      }else{
        this.model.checkedKeys = []
      }
    },
    onCheck(checkedKeys) {
      this.$emit("change",this.model )
    },
    handeTreeData(list){
      list.forEach(item => {
        let json = {
          title:item.tenantName,
          key:item.tenantId,
          children:[
            {
              title:"教职工",
              key:item.tenantId + "3",
              children:[]
            },
            {
              title:"家长",
              key:item.tenantId + "4",
              children:[]
            },
            {
              title:"管理员",
              key:item.tenantId + "5",
              children:[]
            },
          ]
        }
        item.sysUserList.forEach(el => {
          if (el.userIdentity == 3) {
            json.children[0].children.push(
              {
                title:el.realname,
                key:el.id
              }
            )
          }
          if (el.userIdentity == 4) {
            json.children[1].children.push(
              {
                title:el.realname,
                key:el.id
              }
            )
          }
          if (el.userIdentity == 5) {
            json.children[2].children.push(
              {
                title:el.realname,
                key:el.id
              }
            )
          }
        });
        this.treeData.push(json)
      });
    }
  },
  model:{
    prop: 'value',
    event: 'change'
  }
}
</script>
<style scoped>
/* @import url(); 引入css类 */
</style>
